<include file="public/header" />
<div class="x-nav">
            <span class="layui-breadcrumb">
                <a href="">分类</a>
                <a>
                    <cite>分类列表</cite></a>
            </span>
  <a class="layui-btn layui-btn-small" style="line-height:1.6em;margin-top:3px;float:right" onclick="location.reload()" title="刷新">
    <i class="layui-icon layui-icon-refresh" style="line-height:30px"></i>
  </a>
</div>
<div class="layui-input-inline layui-show-xs-block">
  <div class="demoTable" style="width: 500px;">
    搜索：
    <div class="layui-inline">
      <input class="layui-input" name="keyword" id="demoReload" autocomplete="off">
    </div>
    <button class="layui-btn" data-type="reload">搜索</button>
  </div>

  <div class="layui-card-header">
    <button class="layui-btn" onclick="xadmin.open('增加服务','{:url('Goods/EditGoodsServer',array('type'=>2))}',1200,800)">
      <i class="layui-icon"></i>添加</button></div>
</div>

<table id="demo" lay-filter="edit"></table>
<script type="text/html" id="barDemo">
  <!--    <a class="layui-btn layui-btn-xs" lay-event="view">查看</a>-->
  <a class="layui-btn layui-btn-xs" lay-event="edit">编辑</a>
  <a class="layui-btn layui-btn-danger layui-btn-xs" lay-event="del">删除</a>
</script>
<script>

  layui.use(['table','util'], function(){

    var table = layui.table
            ,form = layui.form
            ,util = layui.util;
    //是否启用模板
    var hotTpl = function (d) { //名字需要和上面定义的名字对应上
      var isCkecked = d.is_recommend == "1" ?"checked":"";
      return '<input type="checkbox" lay-filter="is_recommend"  lay-skin="switch" lay-text="是|否" '+ isCkecked +'> ';
    };
    // //是否启用模板
    // var statusTpl = function (d) { //名字需要和上面定义的名字对应上
    //     var la = d.status == "1" ?"checked":"";
    //     var la1 = d.status == "2" ?"checked":"";
    //     var la2 = d.status == "4" ?"checked":"";
    //     var la4 = d.status == "5" ?"checked":"";
    //    var html ='<input type="radio" lay-filter="status"  value="1" title="草稿"'+ la +'> ' +
    //        '<input type="radio" lay-filter="status"   value="2" title="待审核"'+ la1 +'> ' +
    //        '<input type="radio" lay-filter="status"  value="4" title="驳回"'+ la2 +'> ' +
    //        '<input type="radio" lay-filter="status"   value="5" title="通过"'+ la4 +'>';
    //     return  html;
    // };
    // //是否启用模板
    var statusTpl = function (d) { //名字需要和上面定义的名字对应上
      var isCkecked = d.status == "已发布" ?"checked":"";
      return '<input type="checkbox" lay-filter="status"  lay-skin="switch" lay-text="已发布|下架" '+ isCkecked +'> ';
    };
    var imgTpl =function (d){
      var img = d.icon;
      return '<img src="'+ img +'"> ';
    }
    //第一个实例
    table.render({
      elem: '#demo'
      ,url: "{:url('/goods/goodsServer')}" //数据接口
      ,page: true //开启分页
      ,toolbar: '#toolbarDemo'
      ,width:'100%'
      ,cellMinWidth: 80 //全局定义常规单元格的最小宽度，layui 2.2.1 新增
      ,totalRow: true // 开启合计行
      ,response: {
        statusName: 'code' //规定数据状态的字段名称，默认：code
        ,statusCode: 200 //规定成功的状态码，默认：0
        ,msgName: 'msg' //规定状态信息的字段名称，默认：msg
        ,countName: 'total' //规定数据总数的字段名称，默认：count
        ,dataName: 'data' //规定数据列表的字段名称，默认：data
      }
      ,cols: [[ //表头
        {type: 'checkbox', fixed: 'left'},
        {field: 'id', title: 'ID', width:80, sort: true, fixed: 'left'}
        ,{field: 'name', title: '名称',width:150, }
        ,{field: 'icon', title: 'icon',width:150, templet:imgTpl,unresize: true}
        ,{field: 'sort', title: '排序',width:80, }
        ,{field: 'create_time', title: '创作时间',width:200,  sort: true}
        ,{fixed: 'right', title:'操作',  width:200,toolbar: '#barDemo'}
      ]]
      ,id: 'testReload'

      // ,parseData: function(res){ //res 即为原始返回的数据
      // return {
      //     "code": 0, //解析接口状态
      //     "msg": res.message, //解析提示文本
      //     "count": res.total, //解析数据长度
      //     "data": res.data.item //解析数据列表
      // };
      // }
    });
    //触发单元格工具事件
    form.on('switch(is_recommend)', function(data){ // 双击 toolDouble
      var id = data.othis.parents('tr').find("td").eq(1).text();
      var is_recommend = this.checked ? '1' : '0'
      $.ajax({
        type: 'post',
        url:"{:url('/Article/UpdateStatus')}",
        dataType: 'json',
        data:{id:id,is_recommend:is_recommend},
        success: function(data){
          // if(!$(obj).hasClass('no') && !$(obj).hasClass('yes'))
          if(data.code==200){
            setTimeout(

                    layer.msg('success', {icon: 1,time:1000}),
                    2000);

          }else {
            layer.msg('异常', {icon: 2});
          }

        }
      });
    });

    //触发单元格工具事件 修改状态
    form.on('switch(status)', function(data){ // 双击 toolDouble
      var id = data.othis.parents('tr').find("td").eq(1).text();
      var status = this.checked ? '5' : '4'
      $.ajax({
        type: 'post',
        url:"{:url('/Article/UpdateStatus')}",
        dataType: 'json',
        data:{id:id,status:status},
        success: function(data){
          // if(!$(obj).hasClass('no') && !$(obj).hasClass('yes'))
          if(data.code==200){
            setTimeout(

                    layer.msg('success', {icon: 1,time:1000}),
                    2000);

          }else {
            layer.msg('异常', {icon: 2});
          }

        }
      });
    });


    //触发单元格工具事件
    table.on('tool(edit)', function(obj){ // 双击 toolDouble
      var data = obj.data;
      var id= obj.data.id;
      switch (obj.event){
        case 'del':
          // 删除按钮
          layer.confirm('确认删除？', {
            btn: ['确定', '取消'] //按钮
          }, function () {
            $.ajax({
              type: 'post',
              url: "{:url('/Goods/goodServersDel')}",
              data : {id:obj.data.id},
              dataType: 'json',
              success: function (data) {

                if (data.code == 200) {
                  layer.msg(data.msg, {icon: 1,time:100});
                  obj.del();
                } else {
                  layer.alert(data.msg, {icon: 2});
                }
              }
            })
          }, function () {
            layer.closeAll();
          });
          break;
        case 'edit':
          layer.open({
            title: '编辑',
            type: 2,
            area: ['90%','90%'],
            content:  "{:url('/Goods/EditGoodsServer')}?id="+id,
          });
          break;
        case 'view':
          layer.open({
            title: '查看',
            type: 2,
            area: ['90%','90%'],
            content:  '/Goods/GoodsDetail/id/'+id,
          });
          break;
      }
    })
    var $ = layui.$, active = {
      reload: function(){
        var demoReload = $('#demoReload');

        //执行重载
        table.reload('testReload', {
          page: {
            curr: 1 //重新从第 1 页开始
          }
          ,where: {
            keyword: demoReload.val()
          }
        });
      }
    };

    $('.demoTable .layui-btn').on('click', function(){
      var type = $(this).data('type');
      active[type] ? active[type].call(this) : '';
    });

  });
</script>